import React, { Component } from 'react'
import { Table } from 'antd'
import { valueList } from './mock'
export default class componentName extends Component {
  constructor(props) {
    super(props)
    this.state = {
      keyName: props.keyName,
      valueList: valueList,
    }
  }
  filterTable = () => {
    const { keyName } = this.state
    const array = valueList.filter((v) => v.name === keyName)
    console.log('array', array)
    this.setState({ valueList: array })
  }
  componentWillReceiveProps(next, props) {
    if (next.keyName !== props.keyName) {
      this.setState({ keyName: next.keyName }, this.filterTable)
    }
    console.log('next', next)
    console.log('props', props)
  }

  columns = () => {
    return [
      {
        title: '姓名',
        dataIndex: 'name',
        key: 'name',
      },
      {
        title: '年龄',
        dataIndex: 'age',
        key: 'age',
      },
      {
        title: '操作',
        render: (v, r, i) => {
          return <a>编辑</a>
        },
      },
    ]
  }
  render() {
    return (
      <div>
        <h2>value值</h2>
        <Table dataSource={this.state.valueList} columns={this.columns()} />
      </div>
    )
  }
}
